<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>树</title>
    <% include include/link %>
    <link href="https://cdn.bootcss.com/bootstrap-treeview/1.2.0/bootstrap-treeview.min.css" rel="stylesheet">
</head>
<body>
<div class="container-fluid widget-stage">
    <h1 class="widget-stage-title">Douyou8UI 项目通用组件库</h1>
    <p class="widget-stage-desc">项目中应当抽取公共的部分以及较为复杂的部分作为组件，方便复用。其中按钮，对话框，遮罩层，下拉菜单，选项卡和文本输入6个组件因为每个项目中都基本会使用到，因此已经由框架预先实现。</p>
    <section class="widget-item">
        <div class="widget-item-title"></div>
        <div class="widget-item-cnt">
            <div id="tree"></div>
        </div>
    </section>
</div>
<% include include/footer %>
<script src="https://cdn.bootcss.com/bootstrap-treeview/1.2.0/bootstrap-treeview.min.js"></script>
<script>
var tree = [
    {
        text: "Parent 1",
        nodes: [
            {
                text: "Child 1",
                nodes: [
                    {
                        text: "Grandchild 1"
                    },
                    {
                        text: "Grandchild 2"
                    }
                ]
            },
            {
                text: "Child 2"
            }
        ]
    },
    {
        text: "Parent 2"
    },
    {
        text: "Parent 3"
    },
    {
        text: "Parent 4"
    },
    {
        text: "Parent 5"
    }
];
$('#tree').treeview({
    data: tree
});
</script>
</body>
</html>